/**
 * 考勤记录-农民工
 * TableCalendar更多用法：
 * https://www.jianshu.com/p/4c38de101721
 * */

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:frametrim/utility/pickerDialogs.dart';
import 'package:frametrim/utility/screen.dart';
import 'package:frametrim/utility/sq_color.dart';
import 'package:frametrim/utility/timeUtil.dart';
import 'package:frametrim/views/appbar_black.dart';
import 'package:frametrim/views/calendar/mycalendar.dart';
import 'package:frametrim/views/calendar/mycalendar2.dart';
import 'package:frametrim/views/timeline.dart';

class AttendanceLaborRecordPage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => AttendanceLaborRecordState();
}

class AttendanceLaborRecordState extends State<AttendanceLaborRecordPage> {
  late int? mYear = TimeUtil.getYear();
  late int? mMonth = TimeUtil.getMonth();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        backgroundColor: Colors.white,
        body: Stack(
          children: <Widget>[
            Image.asset('image/background.png',
                fit: BoxFit.cover, width: Screen.width, height: Screen.height),
            Column(
              children: <Widget>[
                AppbarCenterTitle(
                  title: '考勤记录',
                  imgStr: 'image/imv_back.png',
                  titleColor: SQColor.black,
                ),
                buildHeaderMess(),
                Expanded(child: MyStyleCalendarView(buildList(),(datetime){
                  setState(() {
                    mYear=datetime.year;
                    mMonth=datetime.month;
                  });
                })),
              ],
            ),
          ],
        ));
  }

  /*头部信息*/
  Widget buildHeaderMess() {
    return Container(
      width: Screen.width - 20,
      margin: EdgeInsets.all(10),
      padding: EdgeInsets.symmetric(horizontal: 10, vertical: 12),
      decoration: ShapeDecoration(
          color: Colors.white,
          shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.all(Radius.circular(5)))),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          Text(
            '二期华侨城',
            style: TextStyle(fontSize: 24, color: SQColor.black),
          ),
          SizedBox(
            height: 5,
          ),
          Row(
            children: <Widget>[
              Expanded(child: Text(
                '本月出勤天数   22天',
                style: TextStyle(fontSize: 15,
                    color: SQColor.color_3C64F9,
                    fontWeight: FontWeight.bold),
              )),
              GestureDetector(
                behavior: HitTestBehavior.opaque,
                onTap: () {
                  PickerDialogs.showYearMonthPicker(context, '选择时间', (result) {
                    setState(() {
                      mYear = result.year;
                      mMonth = result.month;
                    });
                  });
                },
                child: Container(
                  height: 35,
                  padding: EdgeInsets.symmetric(horizontal: 12,),
                  decoration: BoxDecoration(
                      color: Colors.white,
                      borderRadius: BorderRadius.all(Radius.circular(20)),
                      border: Border.all(color: SQColor.color_333333, width: 1)
                  ),
                  child: Row(
                    children: <Widget>[
                      Text('${mYear}年${mMonth}月', style: TextStyle(
                          fontSize: 14, color: SQColor.color_333333),),
                      SizedBox(width: 6,),
                      Image.asset(
                        'image/icon_arrow_black.png', width: 13, height: 8,)
                    ],
                  ),
                ),
              ),
              SizedBox(width: 22,)
            ],
          )
        ],
      ),
    );
  }


  /*列表数据*/
  Widget buildList() {
    return Column(
      children: getData(),
    );
  }

  List<Widget> getData() {
    List<Widget> children = [];
    for (var i = 0; i < 5; i++) {
      children.add(TimeLineView(buildRight(),i,4));
    }
    return children;
  }

  /*右侧内容*/
  Widget buildRight() {
    return Container(
      margin: EdgeInsets.only(left: 20, top: 13),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.start,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          Text(
            '08:56:21(华侨城闸机)',
            style: TextStyle(fontSize: 16, color: SQColor.color_222222),
          ),
          SizedBox(
            height: 5,
          ),
          Row(
            children: <Widget>[
              Image.asset(
                'image/icon_location.png',
                width: 10,
                height: 13,
              ),
              SizedBox(
                width: 5,
              ),
              Text(
                '华侨城工地',
                style: TextStyle(fontSize: 12, color: SQColor.color_666666),
              )
            ],
          ),
          SizedBox(
            height: 10,
          ),
          GestureDetector(
            onTap: () {},
            child: Container(
              width: 150,
              height: 80,
              decoration: BoxDecoration(
                  color: SQColor.color_C4C4C4,
                  borderRadius: BorderRadius.all(Radius.circular(5))),
              // child: Image.network(''),
            ),
          )
        ],
      ),
    );
  }

}
